<%--
  Created by IntelliJ IDEA.
  User: 张梦瑶
  Date: 2025/6/23
  Time: 9:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
  <title>第一个Web应用</title>
  <link rel="stylesheet" href="./css/main.css" type="text/css" />
  <link rel="icon" href="./image/logo.png" />
  <style>
    table {
      width: 100%;
      max-width: 100%;
      margin: 0 auto;
      border-collapse: collapse;
    }
    th, td {
      border: 1px solid #ccc;
      padding: 12px;
      text-align: center;
    }
    th {
      background-color: #f2f2f2;
      font-weight: bold;
    }
    tr.bg_color {
      background-color: #f9f9f9;
    }
    tr:hover {
      background-color: #e6f7ff;
    }
    .txt_right {
      text-align: center;
    }
  </style>
  <script type="application/javascript">
    function changeColor() {
      let p = document.getElementById("p1");
      p.style.color = "red";
    }
  </script>
</head>
<body>
<h1 align="center" title="鼠标悬浮到标签上，可以出现提示信息">Java Web</h1>
<input type="button" value="更改段落文本颜色" onclick="changeColor()">
<p id="p1">
  Java Web 内容学习！！   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;     正在学习！！！！
</p>
<p id="p2">
  第二个段落p的内容！！
</p>
<a href="https://www.163.com" target="_blank">
  <img src="image/hs.jpg" width="300"/>
</a>
<br/>
<!-- 页面中的注释内容 -->
<a href="https://www.baidu.com" target="_blank">访问百度</a>

<table>
  <tr><th>序号</th><th>名称</th><th>产地</th><th>供应商</th><th>联系电话</th><th>商品样例</th></tr>
  <tr><td>1</td><td>祁煜</td><td class="txt_right">利莫里亚</td><td class="txt_right">恋与深空</td><td>13888888888</td>
    <td><img src="image/dwhj.jpg" height="130" width="100"/></td></tr>
  <tr class="bg_color"><td>2</td><td>祁煜</td><td class="txt_right">利莫里亚</td><td class="txt_right">恋与深空</td><td>13888888888</td>
    <td><img src="image/dwhj.jpg" height="130" width="100"/></td></tr>
  <tr><td>3</td><td>祁煜</td><td class="txt_right">利莫里亚</td><td class="txt_right">恋与深空</td><td>13888888888</td>
    <td><img src="image/dwhj.jpg" height="130" width="100"/></td></tr>
  <tr class="bg_color"><td>4</td><td>祁煜</td><td class="txt_right">利莫里亚</td><td class="txt_right">恋与深空</td><td>13888888888</td>
    <td><img src="image/dwhj.jpg" height="130" width="100"/></td></tr>
  <tr><td>5</td><td>祁煜</td><td class="txt_right">利莫里亚</td><td class="txt_right">恋与深空</td><td>13888888888</td>
    <td><img src="image/dwhj.jpg" height="130" width="100"/></td></tr>
</table>

</body>
</html>
